<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>webGIS首页</title>
    <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
    <link href="../css/common.css" rel="stylesheet">
    <link href="../css/index.css" rel="stylesheet">
</head>
<body>
    <div class="container">
        <!--头部-->
        <iframe src="head.html" class="topFrame" name="topFrame"
                scrolling="No"  noresize="noresize" frameborder="0" ></iframe>
        <div class="line-split"></div>
        <!--轮播图部分-->
        <div class="navigation-bar">
            <div id="navigation">
                <div id="list" style="left: -1373px;">
                    <img src="../img/fifth.png" alt="first">
                    <img src="../img/first.jpg" alt="first">
                    <img src="../img/second.jpg" alt="second">
                    <img src="../img/third.jpg" alt="third">
                    <img src="../img/forth.png" alt="forth">
                    <img src="../img/fifth.png" alt="fifth">
                    <img src="../img/first.jpg" alt="fifth">
                </div>
                <div id="buttons">
                    <span index="1" class="on"></span>
                    <span index="2"></span>
                    <span index="3"></span>
                    <span index="4"></span>
                    <span index="5"></span>
                </div>
                <a href="javascript:;" class="arrow" id="prev">&lt;</a>
                <a href="javascript:;" class="arrow" id="next">&gt;</a>
            </div>
            <!--搜索条部分-->
            <div class="search">
                <form class="form-horizontal form-style" role="form">
                    <div class="form-group">
                        <div class="col-sm-12">
                            <input
                                    type="text"
                                    class="form-control"
                                    id="name"
                                    placeholder="请输入服务名称关键词进行搜索">
                        </div>
                    </div>
                    <div class="btn-search">
                        <button
                                id="fat-btn"
                                class="btn btn-primary"
                                type="button"> 搜索
                        </button>
                    </div>
                </form>
            </div>
        </div>
        <div class="line-split-two"></div>
        <!--中部导航部分-->
        <div class="introduction">
            <div class="admin-service">
                <div class="online-grid">
                    <img src="../img/icons/service.png" class="service">
                    <span class="unit-span">行政区划服务已上线</span>
                </div>
            </div>
            <div class="admin-service unit-service">
                <div class="online-grid">
                    <span class="unit-span">单元网格服务已上线</span>
                </div>
            </div>
            <div class="admin-service grid-service">
                <div class="online-grid">
                    <span class="unit-span">市场监督服务已上线</span>
                </div>
            </div>
        </div>
        <!--中间主体部分-->
        <div class="belly">
            <!--icon导航部分-->
            <div class="icons">
                <!--资源管理-->
                <div class="resource-manage">
                   <img src="../img/hr.jpg" alt="资源管理" class="icons-image">
                    <span class="instruction-span">资源管理</span>
                </div>
                <!--服务发布-->
                <div class="resource-manage service-fb">
                    <img src="../img/fb.jpg" alt="服务发布" class="icons-image">
                    <span class="instruction-span">服务发布</span>
                </div>
                <!--地图api-->
                <div class="resource-manage map-api">
                    <img src="../img/map.jpg" alt="地图api" class="icons-image">
                    <span class="instruction-span">地图api</span>
                </div>
                <!--在线地图-->
                <div class="resource-manage online-map">
                    <img src="../img/online.jpg" alt="在线地图" class="icons-image">
                    <span class="instruction-span">在线地图</span>
                </div>
                <!--系统管理-->
                <div class="resource-manage system-manage">
                    <img src="../img/manage.jpg" alt="系统管理" class="icons-image">
                    <span class="instruction-span">系统管理</span>
                </div>
            </div>
            <!--中间说明部分-->
            <div class="part-introduction">
                <!--资源管理-->
                <div class="resource-manage-intro">
                    <div class="message">
                        <span class="intro-title">资源管理</span>
                        <span class="intro-message">为用户提供搜索和查看已发布的专题图层数据，用户可以进一步发布资源，
                                待管理员审核通过后，即可展示服务资源。具有访问权限的图层，
                                用户可以添加到图层导航树上也可以通过功能服务接口进行调用。</span>
                    </div>
                    <div class="intro-picture">
                        <img src="../img/hr.jpg" alt="资源管理说明" class="intro-picture-resource">
                    </div>
                </div>
                <!--服务发布-->
                <div class="resource-manage-intro resource">
                    <div class="message">
                        <span class="intro-title">服务发布</span>
                        <span class="intro-message">支持基本的OGC各类服务的发布，同时支持对扩展服务的发布功能
                                                    同时支持已发布的服务的启动、暂停和删除等管理功能。</span>
                    </div>
                    <div class="intro-picture">
                        <img src="../img/fb.jpg" alt="服务发布说明" class="intro-picture-resource">
                    </div>
                </div>
                <!--地图api-->
                <div class="resource-manage-intro service">
                    <div class="message">
                        <span class="intro-title">地图api</span>
                        <span class="intro-message">为二次开发用户提供产品介绍、开发指南、类参考和JS库下载等功能。</span>
                    </div>
                    <div class="intro-picture">
                        <img src="../img/map.jpg" alt="地图api说明" class="intro-picture-resource">
                    </div>
                </div>
                <!--在线地图-->
                <div class="resource-manage-intro online">
                    <div class="message">
                        <span class="intro-title">在线地图</span>
                        <span class="intro-message">GIS基础支撑平台提供2D，3D，卫星多种地图形式供开发者选择，
                                                无论基于哪种平台，都可以通过GIS基础支撑平台提供的API和SDK轻松的完成地图的构建工作。
                                                同时我们还提供强大的地图再开发能力，全面的地图数据支持，离线在线两种使用方式，
                                                多种地图交互模式，满足各个场景下对地图的需求。</span>
                    </div>
                    <div class="intro-picture">
                        <img src="../img/online.jpg" alt="在线地图说明" class="intro-picture-resource">
                    </div>
                </div>
                <!--在线地图-->
                <div class="resource-manage-intro manage">
                    <div class="message">
                        <span class="intro-title">系统管理</span>
                        <span class="intro-message">系统提供对个政务网内部的单位和用户进行统一权限管理；对于非公共数据，
                                                    需要单位和用户提交资源访问的申请，由系统维护人员审批确认，
                                                    审批通过的单位和用户才能访问该资源。</span>
                    </div>
                    <div class="intro-picture">
                        <img src="../img/manage.jpg" alt="系统管理说明" class="intro-picture-resource">
                    </div>
                </div>
                <!--倒数第二栏公示部分-->
                <div class="of-the-public">
                    <div class="pub-of-first">
                        <img src="../img/back1.jpg" alt="第一部分说明" class="first-intro">
                        <div class="associate-platform">
                            <span class="associate-span">关联平台</span>
                        </div>
                        <div class="specific-information">
                            <span class="specific-title">数据处理</span>
                            <span class="information-message">初步的数据处理主要包括数据格式化、转换和综合。
                                    数据的格式化是指不同数据结构的数据间变换，是一项耗时、易错、需要大量计算量的工作；
                                    数据转换包括数据格式转换、数据比例尺的变换等，数据比例尺的变换涉及数据比例尺缩放、平移、旋转等方面，
                                    其中最为重要的是投影变换；制图综合包括数据平滑和特征集结等</span>
                        </div>
                    </div>
                    <!--第二张图片-->
                    <div class="pub-of-first second">
                        <img src="../img/back2.jpg" alt="第二部分说明" class="first-intro">
                        <div class="associate-platform  back2">
                            <span class="associate-span">关联平台</span>
                        </div>
                        <div class="specific-information">
                            <span class="specific-title">图形显示</span>
                            <span class="information-message">除了常见的二维平面地图之外，地理信息三维显示也成为地理信息一个重要的表现方式。
                                    利用三维显示技术，可以更为直观形象地表现地理环境信息，更容易让用户接受和理解。</span>
                        </div>
                        <!--第三张图片-->
                        <div class="pub-of-first third">
                            <img src="../img/back3.jpg" alt="第三部分说明" class="first-intro">
                            <div class="associate-platform  back3">
                                <span class="associate-span font-style">关联平台</span>
                            </div>
                            <div class="specific-information">
                                <span class="specific-title font-style">图形显示</span>
                            <span class="information-message font-style">除了常见的二维平面地图之外，地理信息三维显示也成为地理信息一个重要的表现方式。
                                    利用三维显示技术，可以更为直观形象地表现地理环境信息，更容易让用户接受和理解。</span>
                            </div>
                        </div>
                        <!--第四张图片-->
                        <div class="pub-of-first forth">
                            <img src="../img/back4.jpg" alt="第四部分说明" class="first-intro">
                            <div class="associate-platform  back3">
                                <span class="associate-span span-style">关联平台</span>
                            </div>
                            <div class="specific-information">
                                <span class="specific-title span-style">空间分析</span>
                            <span class="information-message span-style">空间模型分析是在地理信息系统支持下，分析和解决现实世界中与空间相关的问题，
                                它是地理信息系统应用深化的重要标志。空间分析是地理信息系统的核心功能，
                                也是地理信息系统与其他计算机系统的根本区别，它以空间数据和属性数据为基础，回答真实地理客观世界的有关问题。</span>
                            </div>
                        </div>
                </div>
            </div>
        </div>
        <!--底部版权部分-->
    </div>
</body>
<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../js/index.js"></script>
</html>